<template>
  <a-button v-for="(node, i) in opt" :key="i" class="btn absolute" :style="forS(node.style)" @click="onTag(node)"
    >{{ node.btnName }}
  </a-button>
</template>
<script setup name="rectangle">
import { userStore } from "@/store/modules/userStore";
const store = userStore();
const props = defineProps({
  styles: {
    type: Object,
    required: false,
    default: () => ({})
  },
  opt: {
    type: Array,
    required: false,
    default: () => []
  }
});

function forS(obj) {
  var ob = {};
  for (let key in obj) {
    ob[key] = obj[key] + "px";
  }
  return ob;
}

function onTag(node) {
  if (!node.toPage) return;
  store.chanegCurrentComName(node.toPage);
  store.chanegCurrentAreaName(node.aliasName);
  store.chanegCurrentConf({
    menu3_active: node.menu3_active
  });
}
</script>
<style scoped lang="less">
.btn {
  z-index: 11;
  display: flex;
  justify-content: center;
  width: 45px;
  height: 28px;
}
</style>
